<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		.main_container{
			display: flex;
			flex-wrap: nowrap;
		}
		.icon{
			width: 100px;
			height: 100px;
			justify-content: center; /* 水平居中 */
			align-items: center; /* 垂直居中 */
			flex-wrap: nowrap;
		}
		.icon svg{
			width: 100px;
			display: block;
		}
		.icon label{
			width: 100px;
			display: block;
			text-align: center;
		}
	</style>
	<body>
		<div class="main_container">
			<div class="icon">
				<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="48px" height="48px"><path fill="#8BC34A" d="M18,6C9.2,6,2,12,2,19.5c0,4.3,2.3,8,6,10.5l-2,6l6.3-3.9C14,32.7,16,33,18,33c8.8,0,16-6,16-13.5C34,12,26.8,6,18,6z"/><path fill="#7CB342" d="M20,29c0-6.1,5.8-11,13-11c0.3,0,0.6,0,0.9,0c-0.1-0.7-0.3-1.4-0.5-2c-0.1,0-0.3,0-0.4,0c-8.3,0-15,5.8-15,13c0,1.4,0.3,2.7,0.7,4c0.7,0,1.4-0.1,2.1-0.2C20.3,31.6,20,30.3,20,29z"/><path fill="#CFD8DC" d="M46,29c0-6.1-5.8-11-13-11c-7.2,0-13,4.9-13,11s5.8,11,13,11c1.8,0,3.5-0.3,5-0.8l5,2.8l-1.4-4.8C44.3,35.2,46,32.3,46,29z"/><path fill="#33691E" d="M14,15c0,1.1-0.9,2-2,2s-2-0.9-2-2s0.9-2,2-2S14,13.9,14,15z M24,13c-1.1,0-2,0.9-2,2s0.9,2,2,2s2-0.9,2-2S25.1,13,24,13z"/><path fill="#546E7A" d="M30,26.5c0,0.8-0.7,1.5-1.5,1.5S27,27.3,27,26.5s0.7-1.5,1.5-1.5S30,25.7,30,26.5z M37.5,25c-0.8,0-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5s1.5-0.7,1.5-1.5S38.3,25,37.5,25z"/></svg>
				
				<div>
					<label>微信</label>
				</div>
			</div>
			
			<div class="icon">
				<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="50px" height="50px">    <path d="M 5 4 C 3.346 4 2 5.346 2 7 L 2 13 L 3 13 L 47 13 L 48 13 L 48 11 C 48 9.346 46.654 8 45 8 L 18.044922 8.0058594 C 17.765922 7.9048594 17.188906 6.9861875 16.878906 6.4921875 C 16.111906 5.2681875 15.317 4 14 4 L 5 4 z M 3 15 C 2.448 15 2 15.448 2 16 L 2 43 C 2 44.657 3.343 46 5 46 L 45 46 C 46.657 46 48 44.657 48 43 L 48 16 C 48 15.448 47.552 15 47 15 L 3 15 z"/></svg>
				<div>
					<label>文件夹</label>
				</div>
			</div>
			
			
			<div class="icon">
				<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="48px" height="48px" clip-rule="evenodd"><linearGradient id="dYJkfAQNfP2dCzgdw4ruIa" x1="23.672" x2="23.672" y1="6.365" y2="42.252" gradientTransform="translate(.305 -.206)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#4c4c4c"/><stop offset="1" stop-color="#343434"/></linearGradient><path fill="url(#dYJkfAQNfP2dCzgdw4ruIa)" d="M40.004,41.969L8.031,42c-1.099,0.001-1.999-0.897-2-1.996L6,8.031	c-0.001-1.099,0.897-1.999,1.996-2L39.969,6c1.099-0.001,1.999,0.897,2,1.996L42,39.969C42.001,41.068,41.103,41.968,40.004,41.969z"/><path fill="#ec407a" fill-rule="evenodd" d="M29.208,20.607c1.576,1.126,3.507,1.788,5.592,1.788v-4.011	c-0.395,0-0.788-0.041-1.174-0.123v3.157c-2.085,0-4.015-0.663-5.592-1.788v8.184c0,4.094-3.321,7.413-7.417,7.413	c-1.528,0-2.949-0.462-4.129-1.254c1.347,1.376,3.225,2.23,5.303,2.23c4.096,0,7.417-3.319,7.417-7.413V20.607L29.208,20.607z M30.657,16.561c-0.805-0.879-1.334-2.016-1.449-3.273v-0.516h-1.113C28.375,14.369,29.331,15.734,30.657,16.561L30.657,16.561z M19.079,30.832c-0.45-0.59-0.693-1.311-0.692-2.053c0-1.873,1.519-3.391,3.393-3.391c0.349,0,0.696,0.053,1.029,0.159v-4.1	c-0.389-0.053-0.781-0.076-1.174-0.068v3.191c-0.333-0.106-0.68-0.159-1.03-0.159c-1.874,0-3.393,1.518-3.393,3.391	C17.213,29.127,17.972,30.274,19.079,30.832z" clip-rule="evenodd"/><path fill="#fff" fill-rule="evenodd" d="M28.034,19.63c1.576,1.126,3.507,1.788,5.592,1.788v-3.157	c-1.164-0.248-2.194-0.856-2.969-1.701c-1.326-0.827-2.281-2.191-2.561-3.788h-2.923V28.79c-0.007,1.867-1.523,3.379-3.393,3.379	c-1.102,0-2.081-0.525-2.701-1.338c-1.107-0.558-1.866-1.705-1.866-3.029c0-1.873,1.519-3.391,3.393-3.391	c0.359,0,0.705,0.056,1.03,0.159v-3.19c-4.024,0.083-7.26,3.369-7.26,7.411c0,2.018,0.806,3.847,2.114,5.183	c1.18,0.792,2.601,1.254,4.129,1.254c4.096,0,7.417-3.319,7.417-7.413L28.034,19.63L28.034,19.63z" clip-rule="evenodd"/><path fill="#81d4fa" fill-rule="evenodd" d="M33.626,18.262v-0.854c-1.05,0.002-2.078-0.292-2.969-0.848	C31.445,17.423,32.483,18.018,33.626,18.262z M28.095,12.772c-0.027-0.153-0.047-0.306-0.061-0.461v-0.516h-4.036v16.019	c-0.006,1.867-1.523,3.379-3.393,3.379c-0.549,0-1.067-0.13-1.526-0.362c0.62,0.813,1.599,1.338,2.701,1.338	c1.87,0,3.386-1.512,3.393-3.379V12.772H28.095z M21.635,21.38v-0.909c-0.337-0.046-0.677-0.069-1.018-0.069	c-4.097,0-7.417,3.319-7.417,7.413c0,2.567,1.305,4.829,3.288,6.159c-1.308-1.336-2.114-3.165-2.114-5.183	C14.374,24.749,17.611,21.463,21.635,21.38z" clip-rule="evenodd"/></svg>
				<div>
					<label>抖音</label>
				</div>
			</div>
			
			
			<div class="icon">
				<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="48px" height="48px"><linearGradient id="GpFx29fdoGZviPrySvJupa" x1="4.436" x2="44.861" y1="13.228" y2="52.036" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#f52537"/><stop offset=".293" stop-color="#f32536"/><stop offset=".465" stop-color="#ea2434"/><stop offset=".605" stop-color="#dc2231"/><stop offset=".729" stop-color="#c8202c"/><stop offset=".841" stop-color="#ae1e25"/><stop offset=".944" stop-color="#8f1a1d"/><stop offset="1" stop-color="#7a1818"/></linearGradient><path fill="url(#GpFx29fdoGZviPrySvJupa)" d="M34.7,23.9c-0.6-0.2-1-0.3-0.7-1.1c0.7-1.7,0.8-3.2,0-4.3c-1.4-2-5.3-1.9-9.7-0.1	c0,0-1.4,0.6-1-0.5c0.7-2.2,0.6-4-0.5-5C20.4,10.5,14,13,8.5,18.4C4.4,22.5,2,26.8,2,30.5C2,37.7,11.2,42,20.3,42	C32.1,42,40,35.2,40,29.8C40,26.5,37.2,24.7,34.7,23.9"/><path d="M17.856,39.996c-6.825,0-12.35-3.477-12.851-8.088c-0.203-1.871,0.421-3.762,1.807-5.467	c2.341-2.882,6.524-4.877,11.189-5.336c0.689-0.067,1.384-0.101,2.064-0.101c6.924,0,12.318,3.401,12.828,8.088	c0.205,1.925-0.424,3.845-1.817,5.555c-2.308,2.83-6.486,4.792-11.18,5.248C19.218,39.962,18.531,39.996,17.856,39.996z" opacity=".05"/><path d="M17.856,39.496c-6.569,0-11.88-3.286-12.354-7.642c-0.188-1.735,0.398-3.498,1.697-5.097	c2.259-2.78,6.314-4.708,10.851-5.154c0.673-0.065,1.351-0.099,2.016-0.099c6.664,0,11.85,3.214,12.331,7.642	c0.19,1.789-0.4,3.581-1.708,5.185c-2.225,2.729-6.277,4.623-10.841,5.066C19.186,39.463,18.516,39.496,17.856,39.496L17.856,39.496	z" opacity=".07"/><path fill="#fff" d="M31.9,29.2c-0.5-4.6-6.6-7.8-13.8-7.1C11,22.8,5.5,27.2,6,31.8s6.7,7.8,13.8,7.1	C27,38.2,32.4,33.9,31.9,29.2z"/><linearGradient id="GpFx29fdoGZviPrySvJupb" x1="8.013" x2="25.715" y1="23.432" y2="36.794" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#6e6e6e"/><stop offset=".999" stop-color="#4d4d4d"/></linearGradient><path fill="url(#GpFx29fdoGZviPrySvJupb)" d="M20.9,30.4c-0.3,0.5-0.9,0.8-1.4,0.6c-0.5-0.2-0.6-0.8-0.4-1.3c0.3-0.5,0.9-0.8,1.3-0.5	C21,29.3,21.1,29.8,20.9,30.4 M17.6,32.8c-0.7,1-2.3,1.5-3.5,1s-1.5-1.7-0.8-2.6c0.7-1,2.2-1.4,3.4-1C18,30.6,18.4,31.8,17.6,32.8 M20.5,25.2C17,24.3,13.1,26,11.6,29c-1.5,3.1-0.1,6.5,3.5,7.6c3.6,1.2,7.9-0.6,9.4-3.9C26,29.5,24.1,26.1,20.5,25.2"/><linearGradient id="GpFx29fdoGZviPrySvJupc" x1="32.89" x2="54.166" y1="1.14" y2="40.289" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fed100"/><stop offset=".03" stop-color="#fdce00"/><stop offset="1" stop-color="#e36001"/></linearGradient><path fill="url(#GpFx29fdoGZviPrySvJupc)" d="M45.372,21.781C45.812,20.554,46,19.322,46,18c0-6.6-5.4-12-12-12c-0.5,0-1,0-1.5,0.1 c-0.8,0-1.5,0.7-1.5,1.5s0.7,1.5,1.5,1.5h0.1c0.1,0,0.1,0,0.1,0C33.1,9,33.6,9,34,9c5,0,9,4,9,9c0,1-0.2,2-0.5,2.9 c-0.1,0.2-0.1,0.4-0.1,0.6c0,0.828,0.672,1.5,1.5,1.5c0.149,0,0.291-0.029,0.427-0.069c0.01-0.003,0.02-0.006,0.029-0.009 C44.873,22.755,45.269,22.323,45.372,21.781z"/><linearGradient id="GpFx29fdoGZviPrySvJupd" x1="29.366" x2="50.642" y1="3.056" y2="42.205" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#fed100"/><stop offset=".03" stop-color="#fdce00"/><stop offset="1" stop-color="#e36001"/></linearGradient><path fill="url(#GpFx29fdoGZviPrySvJupd)" d="M34,12h-0.7c0,0,0,0-0.1,0c-0.7,0.1-1.3,0.7-1.3,1.5s0.7,1.5,1.5,1.5h0.5c1.7,0,3,1.3,3,3 c0,0.3-0.1,0.7-0.2,1c-0.1,0.2-0.1,0.3-0.1,0.5c0,0.8,0.7,1.5,1.5,1.5c0.6,0,1.1-0.4,1.4-0.9V20c0-0.1,0-0.1,0.1-0.2 c0.3-0.6,0.4-1.2,0.4-1.8C40,14.7,37.3,12,34,12z"/></svg>
				<div>
					<label>微博</label>
				</div>
			</div>
			
			<div class="icon">
				<svg fill="currentColor" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="48px" height="48px"><path d="M693.12 347.264c11.776 0 23.36.896 35.008 2.176-31.36-146.048-187.456-254.528-365.696-254.528C163.2 94.912 0 230.656 0 403.136c0 99.52 54.272 181.248 145.024 244.736L108.8 756.864l126.72-63.488c45.312 8.896 81.664 18.112 126.912 18.112 11.392 0 22.656-.512 33.792-1.344-7.04-24.256-11.2-49.6-11.2-76.032.064-158.336 136-286.848 308.096-286.848zm-194.816-98.24c27.392 0 45.376 17.984 45.376 45.248 0 27.136-17.984 45.312-45.376 45.312-27.072 0-54.336-18.176-54.336-45.312 0-27.328 27.2-45.248 54.336-45.248zm-253.632 90.56c-27.2 0-54.592-18.176-54.592-45.312 0-27.264 27.392-45.248 54.592-45.248s45.248 17.92 45.248 45.248c0 27.136-18.048 45.312-45.248 45.312zM1024 629.76c0-144.896-145.024-262.976-307.904-262.976-172.48 0-308.224 118.144-308.224 262.976 0 145.28 135.808 262.976 308.224 262.976 36.096 0 72.512-9.024 108.736-18.112l99.392 54.528-27.264-90.624C969.728 783.872 1024 711.488 1024 629.76zm-407.872-45.376c-17.984 0-36.224-17.92-36.224-36.224 0-18.048 18.24-36.224 36.224-36.224 27.52 0 45.376 18.176 45.376 36.224 0 18.304-17.856 36.224-45.376 36.224zm199.36 0c-17.856 0-36.032-17.92-36.032-36.224 0-18.048 18.112-36.224 36.032-36.224 27.264 0 45.376 18.176 45.376 36.224 0 18.304-18.112 36.224-45.376 36.224z"></path></svg>
				<div>
					<label>微信</label>
				</div>
			</div>
			
			



			<div class="icon">
				<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="50px" height="50px"><path d="M 21 3 C 11.621094 3 4 10.621094 4 20 C 4 29.378906 11.621094 37 21 37 C 24.710938 37 28.140625 35.804688 30.9375 33.78125 L 44.09375 46.90625 L 46.90625 44.09375 L 33.90625 31.0625 C 36.460938 28.085938 38 24.222656 38 20 C 38 10.621094 30.378906 3 21 3 Z M 21 5 C 29.296875 5 36 11.703125 36 20 C 36 28.296875 29.296875 35 21 35 C 12.703125 35 6 28.296875 6 20 C 6 11.703125 12.703125 5 21 5 Z"/></svg>
				<div>
					<label>搜索</label>
				</div>
			</div>			
			
			
			


			
			
			
			</div>
	</body>
</html>